<template>
    <div id="app">
        <el-collapse v-model="activeNames" @change="handleChange">
            <el-collapse-item :title="nowWeek=='星期四'?'星期四交易提示':'交易提示'" name="1">
                <div v-if="nowWeek=='星期四'"  style="color:#de1a17">{{nowWeek}}</div>
                <div v-if="parseInt(nowDate.substring(8,10))>28"  style="color:#de282e">{{nowDate}}</div>
                <div>1、TS超过66的时候在选股，选股小心谨慎，错过不会亏，重要不要选错，前25没有适合的股就空仓或者小仓</div>
                <div>2、优先根据板块选股，注意昨天和今天的首板的板块和题材概念。</div>
                <div>3、开盘急拉后横盘的股不选，<span style="color:#bf0606">尽量选择分时线以上的股</span></div>
                <div>4、月份数周分数需要满足条件（分母-分子）<=3，周回撤和月回撤风险不能过高，满足预周月最好</div>
                <div>5、峰值整点（00，50）的时候不追（#号显示），反之可以，邻近涨停的点，或者一个整数点卖掉</div>
                <div>6、有把握的时候10%左右也可以小仓进入</div>
                <div>7、观察手中持股行业资金流向，公司主营业务收益</div>
                <div>8、心态:浮亏的时候慎重操作,盈利时耐心，<span style="color:#bf0606">交易百分十99的时间都是等待</span></div>
                <div>9、不满仓，至少分三个策略，1、板块资金，2、题材前1.2，3、频繁提示</div>
                <div>10、操作第一，选股第二，横盘时，及时止盈止损，获取再次选择的机会，3个点浮盈也很多</div>
            </el-collapse-item>
            <el-collapse-item title="板块选择(数量-名字-占比-资金排序-资金差值)" name="2">
                <div>
                    <el-button type="text" @click="sshy('')">占比排序</el-button>
                    <el-button type="text"  @click="sshy('max')">资金大小</el-button>
                    <el-button type="text" @click="sshy('gap')">资金差值</el-button>
                </div>
                     <span v-for="item in sshyPrecentVo">
                           <el-tag @click="getListData(item.sshy,2)">{{item.num}}{{item.sshy}}{{item.precent|numFilter}}%-{{item.index}}-{{item.maxGap}}</el-tag>
                    </span>
            </el-collapse-item>
            <el-collapse-item title="概念选择(数量-名字-占比-资金排序-资金差值)" name="3">
                <div>
                    <el-button type="text" @click="ssgn('')">占比排序</el-button>
                    <el-button type="text"  @click="ssgn('max')">资金大小</el-button>
                    <el-button type="text" @click="ssgn('gap')">资金差值</el-button>
                </div>
                 <span v-for="item in ssGnPrecentVo">
                     <el-tag @click="getListData(item.sshy,1)">{{item.num}}{{item.sshy}}{{item.precent|numFilter}}%-{{item.index}}-{{item.maxGap}}</el-tag>
                  </span>
            </el-collapse-item>
<!--            <el-collapse-item title="数据说明" name="4">-->
<!--                <el-table   :data="sharesList">-->
<!--                    <el-table-column-->
<!--                            label="代码">-->
<!--                        <template slot-scope="scope">-->
<!--                    <div>代码</div>-->
<!--                    <div>提示排名，名称，最近提示次数</div>-->
<!--                    <div>行业，行业占比(%)</div>-->
<!--                    <div>周涨幅，月涨幅</div>-->
<!--                    <div>提示价格，提示涨幅</div>-->
<!--                    <div>现在价格，现在涨幅</div>-->
<!--                    <div>神奇九转，神奇电波，电波到现在涨幅</div>-->
<!--                        </template>-->
<!--                    </el-table-column>-->
<!--                    <el-table-column-->
<!--                            label="代码">-->
<!--                        <template slot-scope="scope">-->
<!--                        <div>TS</div>-->
<!--                        <div>解禁距今天数，筹码集中度</div>-->
<!--                        <div>重组，减持，户均市</div>-->
<!--                        <div>板块资金最低排名->板块资金现在排名</div>-->
<!--                        <div>个股资金最低排名->个股资金现在排名</div>-->
<!--                        <div>预报，营收，利润</div>-->
<!--                        <div>个股市盈率，行业平均市盈率，排名</div>-->
<!--                    </template>-->
<!--                    </el-table-column>-->
<!--                    <el-table-column-->
<!--                            label="代码">-->
<!--                        <template slot-scope="scope">-->
<!--                        <div>周回撤，</div>-->
<!--                        <div>月回撤</div>-->
<!--                        <div>周涨幅和最大周涨幅差距，周分数</div>-->
<!--                        <div>月涨幅和最大周涨幅差距，周分数名</div>-->
<!--                        <div>筹码和上次统计变化，本次统计时间</div>-->
<!--                        <div>期间涨幅</div>-->
<!--                        </template>-->
<!--                    </el-table-column>-->
<!--                </el-table>-->
<!--            </el-collapse-item>-->
        </el-collapse>
        <el-row :gutter="24">
            <el-col :span="4">
                <template>
                    <el-checkbox v-model="checkedts">TS</el-checkbox>
                    <el-checkbox v-model="checkedcm">筹码</el-checkbox>
                    <el-checkbox v-model="checkedtsnum">>2次</el-checkbox>
                </template>
            </el-col>
            <el-col :span="4">
                <template>
                    <el-checkbox v-model="checkedzfs">周分数</el-checkbox>
                    <el-checkbox v-model="checkedyfs">月分数</el-checkbox>
                    <el-checkbox v-model="checkedyd" >异动</el-checkbox>
                </template>
            </el-col>
            <el-col :span="4">
                <template>
                    <el-checkbox v-model="checkedzzdf">周zdf</el-checkbox>
                    <el-checkbox v-model="checkedzmax">周max</el-checkbox>
                    <el-checkbox v-model="checkedzmavg">均线上</el-checkbox>
                </template>
            </el-col>
            <el-col :span="4">
                <template>
                    <el-checkbox  v-model="checkedxtj">新统计</el-checkbox>
                    <el-checkbox v-model="checkedzf">涨幅</el-checkbox>
                    <el-checkbox v-model="checkedjz">九转</el-checkbox>
                </template>
            </el-col>
            <el-col :span="4">
                <template>
                    <el-checkbox v-model="checkedydb">电波</el-checkbox>
                    <el-checkbox v-model="checkedyczfs">预周月</el-checkbox>
                    <el-checkbox v-model="checkedyzyz">周月跌</el-checkbox>
                </template>
            </el-col>
            <el-col :span="4">
                <el-button icon="el-icon-search" circle @click="getListData()"></el-button>
            </el-col>
        </el-row>


        <el-row :gutter="24">
            <el-col :span="4">
                <template>
                    <el-checkbox v-model="kf">分s</el-checkbox>
                </template>
            </el-col>
            <el-col :span="4">
                <template>
                    <el-checkbox v-model="kr">日k</el-checkbox>
                </template>
            </el-col>
            <el-col :span="4">
                <template>
                    <el-checkbox v-model="k5">五k</el-checkbox>
                </template>
            </el-col>
            <el-col :span="4">
                <template>
                    <el-checkbox v-model="kz">周k</el-checkbox>
                </template>
            </el-col>
            <el-col :span="4">
                <template>
                    <el-checkbox v-model="ky">月k</el-checkbox>
                </template>
            </el-col>
        </el-row>
        <span>

        </span>




        <el-container>
            <el-table
                    :data="sharesList"
                    style="width: 100%"
                    :row-key="getRowKeys"
                    :expand-row-keys="expands"
                    @row-click="clickRowHandle"
            >
                <el-table-column type="expand" width="1">
                    <template slot-scope="props" >
                        <el-form label-position="left" inline class="demo-table-expand">
                            <el-form-item label="">
                                <el-divider content-position="left">所属行业</el-divider>
                                <div>
                                    <el-tag @click="getListData(props.row.sshy,2)">  {{ props.row.sshy }}</el-tag>
                                </div>
                                <el-divider content-position="left">所属概念</el-divider>
                                <div>
                                    <span v-for="itme in JSON.parse(props.row.ssgn)">
                                        <el-tag @click="getListData(itme,1)">   {{itme}}</el-tag>
                                    </span>
                                </div>
                                <el-divider content-position="left">股东人数</el-divider>
                                <div v-if="props.row.sharesGdnums ">
                                    <div v-for="itme in props.row.sharesGdnums">
                                    <table border="1" cellspacing="0"  cellpadding="0" >
                                        <tr>
                                            <td>股东户</td>
                                            <td>变化</td>
                                            <td>价格</td>
                                            <td>户市值</td>
                                            <td>上次</td>
                                            <td>本次</td>
                                            <td>公布</td>
                                        </tr>
                                        <tr>
                                            <td>{{itme.holderNum}}</td>
                                            <td>{{itme.holderNumRatio.substring(0,5)}}%</td>
                                            <td>{{itme.f2}}</td>
                                            <td>{{itme.avgMarketCap|numberFormat}}</td>
                                            <td>{{itme.preEndDate.substring(5,10)}}</td>
                                            <td>{{itme.endDate.substring(5,10)}}</td>
                                            <td>{{itme.holdNoticeDate.substring(5,10)}}</td>
                                        </tr>
                                    </table>

<!--                                        <el-table-->
<!--                                                :data="props.row.sharesGdnums"-->
<!--                                        >-->
<!--                                            <el-table-column-->
<!--                                                    label="股东户"-->
<!--                                                    width="70"-->
<!--                                            >-->
<!--                                                <template slot-scope="scope">-->
<!--                                                    {{scope.row.holderNum}}-->
<!--                                                </template>-->
<!--                                            </el-table-column>-->
<!--                                            <el-table-column-->
<!--                                                    label="变化"-->
<!--                                                    width="70"-->
<!--                                            >-->
<!--                                                <template slot-scope="scope">-->
<!--                                                    {{(scope.row.holderNumRatio).substring(0,5)}}-->
<!--                                                </template>-->
<!--                                            </el-table-column>-->
<!--                                            <el-table-column-->
<!--                                                    label="价格"-->
<!--                                                    width="70"-->
<!--                                            >-->
<!--                                                <template slot-scope="scope">-->
<!--                                                    {{scope.row.f2}}-->
<!--                                                </template>-->
<!--                                            </el-table-column>-->
<!--                                            <el-table-column-->
<!--                                                    label="户市值"-->
<!--                                                    width="70"-->
<!--                                            >-->
<!--                                                <template slot-scope="scope">-->
<!--                                                    {{(scope.row.avgMarketCap)|numberFormat}}-->
<!--                                                </template>-->
<!--                                            </el-table-column>-->
<!--                                            <el-table-column-->
<!--                                                    label="本次"-->
<!--                                                    width="70"-->
<!--                                            >-->
<!--                                                <template slot-scope="scope">-->
<!--                                                    {{(scope.row.endDate).substring(5,10)}}-->
<!--                                                </template>-->
<!--                                            </el-table-column>-->
<!--                                            <el-table-column-->
<!--                                                    label="上次"-->
<!--                                                    width="70"-->
<!--                                            >-->
<!--                                                <template slot-scope="scope">-->
<!--                                                    {{(scope.row.preEndDate).substring(5,10)}}-->
<!--                                                </template>-->
<!--                                            </el-table-column>-->
<!--                                            <el-table-column-->
<!--                                                    label="公布"-->
<!--                                                    width="70"-->
<!--                                            >-->
<!--                                                <template slot-scope="scope">-->
<!--                                                    {{(scope.row.holdNoticeDate).substring(5,10)}}-->
<!--                                                </template>-->
<!--                                            </el-table-column>-->
<!--                                        </el-table>-->

                                    </div>
                                </div>
                                <el-divider content-position="left">股东变化</el-divider>
                                <div v-if="props.row.sharesGdChanges !=null">
                                <table border="1" cellspacing="0"  cellpadding="0" >
                                    <tr>
                                        <td>筹码</td>
                                        <td>股东户</td>
                                        <td>价格</td>
                                        <td>户市值</td>
                                        <td>户均数</td>
                                        <td>时间</td>
                                    </tr>
                                    <tr v-for="item in  props.row.sharesGdChanges">
                                        <td>{{item.holdFocus}}</td>
                                        <td>{{item.holderTotalNum}}</td>
                                        <td>{{item.price}}</td>
                                        <td>{{item.avgHoldAmt|numberFormat}}</td>
                                        <td>{{item.avgFreeShares}}</td>
                                        <td>{{(item.endDate).substring(0,10)}}</td>
                                    </tr>
                                </table>

<!--                                <el-table-->
<!--                                        :data="props.row.sharesGdChanges"-->
<!--                                >-->
<!--                                    <el-table-column-->
<!--                                            label="筹码"-->
<!--                                            width="80"-->
<!--                                    >-->
<!--                                        <template slot-scope="scope">-->
<!--                                            {{scope.row.holdFocus}}-->
<!--                                        </template>-->
<!--                                    </el-table-column>-->
<!--                                    <el-table-column-->
<!--                                            label="股东户"-->
<!--                                            width="80"-->
<!--                                    >-->
<!--                                        <template slot-scope="scope">-->
<!--                                            {{(scope.row.holderTotalNum)}}-->
<!--                                        </template>-->
<!--                                    </el-table-column>-->
<!--                                    <el-table-column-->
<!--                                            label="价格"-->
<!--                                            width="80">-->
<!--                                        <template slot-scope="scope">-->
<!--                                            {{scope.row.price}}-->
<!--                                        </template>-->
<!--                                    </el-table-column>-->
<!--                                    <el-table-column-->
<!--                                            label="户市值"-->
<!--                                            width="80">-->
<!--                                        <template slot-scope="scope">-->
<!--                                            {{(scope.row.avgHoldAmt)|numberFormat}}-->
<!--                                        </template>-->
<!--                                    </el-table-column>-->
<!--                                    <el-table-column-->
<!--                                            label="户均数"-->
<!--                                            width="80">-->
<!--                                        <template slot-scope="scope">-->
<!--                                            {{(scope.row.avgFreeShares)}}-->
<!--                                        </template>-->
<!--                                    </el-table-column>-->
<!--                                    <el-table-column-->
<!--                                            label="时间"-->
<!--                                            width="80">-->
<!--                                        <template slot-scope="scope">-->
<!--                                            {{(scope.row.endDate).substring(0,10)}}-->
<!--                                        </template>-->
<!--                                    </el-table-column>-->
<!--                                </el-table>-->

                                </div>

                                <div v-if="props.row.businesses != null">
                                    <el-divider content-position="left"> 主营业务</el-divider>
                                    <table>
                                        <tr>
                                            <td>主营构成</td>
                                            <td>主营收入(元)</td>
                                            <td>收入比例</td>
                                            <td>主营利润(元)</td>
                                            <td>利润比例</td>
                                            <td>毛利率(%)</td>
                                        </tr>
                                        <tr  v-for="item in props.row.businesses">
                                            <td>{{item.itemName}}</td>
                                            <td>{{item.mainBusinessIncome|numberFormat}}</td>
                                            <td>{{item.mbiRatio|numFilter}}</td>
                                            <td>{{item.mainBusinessRpofit|numberFormat}}</td>
                                            <td>{{item.mbrRatio|numFilter}}</td>
                                            <td>{{item.grossRpofitRatio|numFilter}}</td>
                                        </tr>
                                    </table>
                                    <div>
                                        <span></span>
                                    </div>
                                </div>

                                <div v-if="props.row.bkzj !=null">
                                    <el-divider content-position="left"> {{props.row.bkzj.f14}}:行业资金流向</el-divider>

                                    <div v-if="props.row.bkzj!=null">
                                        <span v-for="item in props.row.bkzj.indexList">
                                            <span>{{item}}</span>,
                                        </span>
                                    </div>
                                    <div>
                    <span :style="{'color': (props.row.bkzj.f62>0 ? '#bf0606':'#4acb21')}">
                    今日主力净流入:{{props.row.bkzj.f62|numberFormat}}
                  占比:{{props.row.bkzj.f184}}
                      </span>
                                    </div>
                                    <div>
                    <span :style="{'color': (props.row.bkzj.f66>0 ? '#bf0606':'#4acb21')}">
                      今日超大单净流入:{{props.row.bkzj.f66|numberFormat}}
                  占比:{{props.row.bkzj.f69}}
                    </span>
                                    </div>
                                    <div>
                     <span :style="{'color': (props.row.bkzj.f72>0 ? '#bf0606':'#4acb21')}">
                    今日大单净流入:{{props.row.bkzj.f72|numberFormat}}
                  占比:{{props.row.bkzj.f75}}
                     </span>
                                    </div>
                                    <div>
                       <span :style="{'color': (props.row.bkzj.f78>0 ? '#bf0606':'#4acb21')}">
                    今日中单净流入:{{props.row.bkzj.f78|numberFormat}}
                  占比:{{props.row.bkzj.f81}}
                       </span></div>
                                    <div>
                      <span :style="{'color': (props.row.bkzj.f84>0 ? '#bf0606':'#4acb21')}">
                     今日小单净流入:{{props.row.bkzj.f84|numberFormat}}
                  占比:{{props.row.bkzj.f87}}
                      </span>
                                    </div>
                                    <div>
                                        流入最大股:{{props.row.bkzj.f205}}-{{props.row.bkzj.f204}}
                                    </div>
                                    <div>行业排名:{{props.row.bkzj.index}}</div>
                                </div>


                                <div v-if="props.row.ggzj !=null">
                                    <el-divider content-position="left"> {{props.row.ggzj.f14}}:个股资金流向</el-divider>
                                    <div v-if="props.row.ggzj!=null">
                                        <span v-for="item in props.row.ggzj.indexList">
                                            <span>{{item}}</span>,
                                        </span>
                                    </div>
                                    <div>
                    <span >

                    </span>
                                        <span :style="{'color': (props.row.ggzj.f62>0 ? '#bf0606':'#4acb21')}">
                    今日主力净流入:{{props.row.ggzj.f62|numberFormat}}
                    占比:{{props.row.ggzj.f184}}
                    </span>
                                    </div>
                                    <div>
                      <span :style="{'color': (props.row.ggzj.f66>0 ? '#bf0606':'#4acb21')}">
                    今日超大单净流入:{{props.row.ggzj.f66|numberFormat}}
                    占比:{{props.row.ggzj.f69}}
                      </span>
                                    </div>
                                    <div>
                      <span :style="{'color': (props.row.ggzj.f72>0 ? '#bf0606':'#4acb21')}">
                    今日大单净流入:{{props.row.ggzj.f72|numberFormat}}
                    占比:{{props.row.ggzj.f75}}
                      </span>
                                    </div>
                                    <div>
                     <span :style="{'color': (props.row.ggzj.f78>0 ? '#bf0606':'#4acb21')}">
                    今日中单净流入:{{props.row.ggzj.f78|numberFormat}}
                    占比:{{props.row.ggzj.f81}}
                     </span>
                                    </div>
                                    <div>
                       <span :style="{'color': (props.row.ggzj.f78>0 ? '#bf0606':'#4acb21')}">
                    今日小单净流入:{{props.row.ggzj.f84|numberFormat}}
                    占比:{{props.row.ggzj.f87}}
                       </span>
                                    </div>
                                    <div>个股排名:{{props.row.ggzj.index}}</div>
                                </div>
                                <el-divider content-position="left">行业vs个股</el-divider>
                                <div v-if="((props.row.ggsyl!=null)&&(props.row.hysyl!=null))">
                                    <table>
                                        <tr>
                                            <td></td>
                                            <td>个股</td>
                                            <td>行业</td>
                                            <td>排名</td>
                                        </tr>

                                        <tr>
                                            <td>总市值</td>
                                            <td>    {{props.row.ggsyl.f20|numberFormat}}</td>
                                            <td> {{props.row.hysyl.f2020|numberFormat}}</td>
                                            <td>   {{props.row.ggsyl.f1020}}/{{props.row.hysyl.f134}}</td>
                                        </tr>
                                        <tr>
                                            <td>净资产</td>
                                            <td>  {{props.row.ggsyl.f135|numberFormat}}</td>
                                            <td> {{props.row.hysyl.f2135|numberFormat}}</td>
                                            <td>   {{props.row.ggsyl.f1135}} /{{props.row.hysyl.f134}}</td>
                                        </tr>
                                        <tr>
                                            <td>净利润</td>
                                            <td> {{props.row.ggsyl.f45|numberFormat}}</td>
                                            <td>  {{props.row.hysyl.f2045|numberFormat}}</td>
                                            <td> {{props.row.ggsyl.f1045}} /{{props.row.hysyl.f134}}</td>
                                        </tr>
                                        <tr>
                                            <td>市盈率(动)</td>
                                            <td>  {{props.row.ggsyl.f9|numberFormat}}</td>
                                            <td> {{props.row.hysyl.f2009|numberFormat}}</td>
                                            {{props.row.ggsyl.f1009}} /{{props.row.hysyl.f134}}
                                        </tr>
                                        <tr>
                                            <td>市净率</td>
                                            <td>{{props.row.ggsyl.f23|numberFormat}}</td>
                                            <td>     {{props.row.hysyl.f2023|numberFormat}}</td>
                                            <td>   {{props.row.ggsyl.f1132}} /{{props.row.hysyl.f134}}</td>
                                        </tr>
                                        <tr>
                                            <td>毛利率</td>
                                            <td>  {{props.row.ggsyl.f49.substring(0,5)}}</td>
                                            <td>    {{props.row.hysyl.f2049}}</td>
                                            <td> {{props.row.ggsyl.f1049}} /{{props.row.hysyl.f134}}</td>
                                        </tr>
                                        <tr>
                                            <td>净利率</td>
                                            <td>  {{props.row.ggsyl.f129.substring(0,5)}}</td>
                                            <td>    {{props.row.hysyl.f2129}}</td>
                                            <td>   {{props.row.ggsyl.f1129}}/{{props.row.hysyl.f134}}</td>
                                        </tr>
                                        <tr>
                                            <td>ROE</td>
                                            <td>  {{props.row.ggsyl.f37}}</td>
                                            <td>     {{props.row.hysyl.f2037}}</td>
                                            <td>{{props.row.ggsyl.f1037}}/{{props.row.hysyl.f134}}</td>
                                        </tr>
                                    </table>
                                </div>

                                <el-divider content-position="left">最近质押价格</el-divider>
                                <div>
                                    {{props.row.zyPrice}}
                                </div>
                                <el-divider content-position="left">最近解禁情况</el-divider>
                                <div>
                                    <div v-for="itme in props.row.unfastenList">
                                        {{itme}}
                                    </div>
                                </div>
                                <div>
                                    <el-divider content-position="left">最近股东增减持</el-divider>
                                    <div v-for="itme in props.row.sharesDirections">
                                        <div>
                                            <span :style="{'color': (itme.direction=='增持' ? '#bf0606':'#4acb21')}"> {{itme.direction}}</span>
                                            {{itme.gdName}}</div>
                                        <div>{{ (itme.stTime).substring(0,10)}}~{{(itme.enTime).substring(0,10)}}</div>
                                    </div>
                                </div>

                                <div>
                                    <el-divider content-position="left">并购重组</el-divider>
                                    <div v-for="itme in props.row.sharesBgczs">
                      <span style="color:#280cd0">
                      {{ (itme.time).substring(0,10)}} {{itme.type}}
                    </span>
                                        {{itme.title}}
                                    </div>
                                </div>
                                <el-divider content-position="left">业绩预告</el-divider>
                                <div>
                                    <div v-for="itme in props.row.sharesYjygs">
                                        <div>
                      <span style="color:#c79513">
                     {{ (itme.noticeDate).substring(0,10)}}-   {{itme.predictType}}:
                    </span>
                                            百分比:{{itme.addAmpLower}}%---
                                            金额:{{itme.forecastJz}}

                                        </div>
                                        <div>
                       <span style="color:#735179">
                      业绩变动:
                    </span>
                                            {{itme.changeReasonExplain}}...
                                        </div>
                                        <div>
                      <span style="color:#47ba84">
                      原因
                    </span> :{{itme.predictContent}}
                                        </div>
                                    </div>
                                </div>
                                <el-divider content-position="left">业绩报告</el-divider>
                                <div>
                                    <div v-for="itme in props.row.sharesYjbgs">
                                        <div>
                                            最新公告日期:{{ (itme.updateDate).substring(0,10)}}
                                        </div>
                                        <div> 营业总收入: {{itme.totalOperateIncome}}</div>
                                        <div> 同比增长: {{itme.ystz}}%</div>
                                        <div> 季度环比增长: {{itme.yshz}}%</div>
                                        <div> 净利润:{{itme.parentNetprofit}}</div>
                                        <div>同比增长:          {{itme.sjltz}}</div>
                                        <div> 季度环比增长: {{itme.sjlhz}}</div>
                                    </div>
                                </div>
                                <el-divider content-position="left">个股公告</el-divider>
                                <div>
                                    <div v-for="itme in props.row.notices">
                    <span style="color:#13c1c7">
                      {{ (itme.time).substring(0,10)}} {{itme.type}}
                    </span>
                                        {{itme.title}}
                                    </div>
                                </div>

                                <el-divider content-position="left">行业公告</el-divider>
                                <div>
                                    <div v-for="itme in props.row.sharesHyzxes">
                                        <span :style="{'color': (itme.type=='行业资讯' ? '#0ade2e':'#08f3c4')}"> {{itme.type}}: </span>
                                        {{itme.title}}
                                    </div>
                                </div>

                                <el-divider content-position="left">历史周涨幅情况</el-divider>
                                <div v-for="itme in props.row.zvoList">
                                    {{itme.d}}=={{itme.zdf}}%==当周:{{itme.newzdf}}%==差值
                                    <span :style="{'color': (itme.sub>0 ? '#de3b1f':'#090510')}"> {{ itme.sub}}% </span>
                                </div>

                                <el-divider content-position="left">历史月涨幅情况</el-divider>
                                <div v-for="itme in props.row.yvoList">
                                    {{itme.d}}=={{itme.zdf}}%==当月:{{itme.newzdf}}%==差值
                                    <span :style="{'color': (itme.sub>0 ? '#de3b1f':'#090510')}"> {{ itme.sub}}% </span>
                                </div>

                                <el-divider content-position="left">分时概率</el-divider>
                                <span>
                  分时
                  <div><img :src="props.row.srcf" width="100%"></div>
                  五分
                  <div><img :src="props.row.src5" width="100%"></div>
                  日K
                  <div><img :src="props.row.srcr" width="100%"></div>
                  周K
                  <div><img :src="props.row.srcz" width="100%"></div>
                  月K
                  <div><img :src="props.row.srcy" width="100%"></div>
                </span>
                                <div v-html="props.row.zyzf"></div>
                                <div v-html="props.row.hy"></div>
                                <div v-html="props.row.gd"></div>

                            </el-form-item>
                        </el-form>
                    </template>
                </el-table-column>

                <el-table-column
                        label="代码"
                >
                    <template slot-scope="scope" >
                        <div>

                             <span  :style="{'color': ( scope.row.asorder==25 ? '#4a34de':'#090510')}" >
                                {{scope.row.asorder}}  {{ scope.row.code }}
                            </span>

                        </div>
                        <div>
                            <span  :style="{'color': ( scope.row.tsNum!=null&&scope.row.tsNum>2 ? '#de3b1f':'#090510')}" >
                                {{scope.row.tsOrder}}{{ scope.row.name }}{{ scope.row.tsNum}}
                            </span>
                        </div>

                        <div>
                            <el-tag @click="getListData(scope.row.sshy,2)">  {{ scope.row.sshy }} {{ scope.row.sshyPercent}}</el-tag>
                        </div>

                        <!--周涨幅，月涨幅-->
                        <div>
                            <span>  {{scope.row.bzzf}}%</span>
                            <span>  {{scope.row.byzf}}%</span>
                        </div>
                        <div>
                        t    <span> {{ scope.row.tsprice }}</span>
                            <span> {{scope.row.tsZdf}}</span>

                        </div>
                        <div>
                        x    {{ scope.row.newPrice }}
                            <span v-if="scope.row.newZdf>10" style="color:#de1ec3">
                                    {{ scope.row.newZdf}}%
                           </span>
                            <span v-if="scope.row.newZdf<10&&scope.row.newZdf>5" style="color:#de2c31">
                                 {{ scope.row.newZdf}}%
                          </span>
                                 <span v-if="scope.row.newZdf<5" style="color:#090510">
                              {{ scope.row.newZdf}}%
                             </span>
                        </div>
                        <div>
                            <span v-if="scope.row.index!=null" :style="{'color': (scope.row.index>4)? '#de2e35':'#090510'}">{{scope.row.index}}转</span>
                            <span v-if="scope.row.magical != null" >
                            <span  style="color:#bc17de">{{scope.row.magical}}电</span>
                            <span   v-if="scope.row.dbzf != null" :style="{'color': ( ((scope.row.dbzf>0)&&(scope.row.dbzf<10 ))? '#de2f29':'#090510')}" >{{scope.row.dbzf}}%</span>
                        </span>
                        </div>
                    </template>
                </el-table-column>

                <el-table-column
                        label="提示"
                >
                    <template slot-scope="scope">
                        <div>
                            ts:{{ scope.row.keepNum }}/   <span :style="{'color': ( scope.row.keepTotal>60 ? '#de3b1f':'#090510')}"> {{scope.row.keepTotal}} </span>
                            <span v-if="scope.row.htype==1" >#</span>
                        </div>
<!--                        <div>-->
<!--                            {{ scope.row.tsprice }}-<span :style="{'color': ( scope.row.tsZdf<4.99 ? '#6b69de':'#090510')}"> {{scope.row.tsZdf}} </span>-->
<!--                        </div>-->
                        <div>
                            j: <span :style="{'color': ( scope.row.unfastenDay<30 ? '#de3ecf':'#090510')}"> {{scope.row.unfastenDay}} </span>
                            <span v-if="(scope.row.sharesGdChanges!=null &&scope.row.sharesGdChanges.length>0 )">
                                <span v-if="scope.row.sharesGdChanges[0].holdFocus.indexOf('集中')!=-1">
                                  <span style="color:#de3b4c"> {{scope.row.sharesGdChanges[0].holdFocus}} </span>
                                </span>
                                <span v-if="scope.row.sharesGdChanges[0].holdFocus.indexOf('分散')!=-1">
                                  <span style="color:#79de76"> {{scope.row.sharesGdChanges[0].holdFocus}} </span>
                                </span>
                            </span>
                        </div>
                        <div>
                            <span v-if="scope.row.sharesDirections != null">持</span>
                            <span v-if="scope.row.sharesBgczs != null ">重</span>
                            <span v-if="scope.row.sharesYjygs != null ">
                                预
                            </span>
                            <!--户市值-->
                            <span v-if="scope.row.sharesGdnums!=null&&scope.row.sharesGdnums.length>0 ">
                                  <td>{{scope.row.sharesGdnums[0].avgMarketCap|numberFormat}}</td>
                            </span>
                        </div>
                        <div>
                            <!--流入流出-->
                            <span v-if="scope.row.bkzj != null">
                                z{{scope.row.bkzj.min}}->
                            </span>
                            <span v-if="scope.row.bkzj!=null">
                                 <span v-if="scope.row.bkzj.f62>0" style="color:#de3b1f">z{{scope.row.bkzj.index}}</span>
                                 <span v-else style="color:#45de6f">z{{scope.row.bkzj.index}}</span>
                            </span>
<!--                            <span v-if="scope.row.bkzj.maxGap!=null">-->
<!--                                :{{scope.row.bkzj.maxGap}}-->
<!--                            </span>-->
                        </div>
                        <div>
                             <span v-if="scope.row.ggzj != null">
                               g{{scope.row.ggzj.min}}->
                            </span>
                            <span v-if="scope.row.ggzj!=null">
                                 <span v-if="scope.row.ggzj.f62>0"  style="color:#de3b1f">g{{scope.row.ggzj.index}}</span>
                                 <span v-else style="color:#45de6f">g{{scope.row.ggzj.index}}</span>
                            </span>
<!--                            <span v-if="scope.row.ggzj.maxGap!=null">-->
<!--                                :{{scope.row.ggzj.maxGap}}-->
<!--                            </span>-->
                        </div>
                        <div>
                                <span v-if="scope.row.sharesYjbgs!= null  ">
                                报
                                </span>

                                <span v-if="scope.row.sharesYjbgs[0].ystz !=null" :style="{'color': ( scope.row.sharesYjbgs[0].ystz>0 ? '#de2f29':'#6ade4c')}">
                                    y{{(scope.row.sharesYjbgs[0].ystz).split(".")[0]}}
                                </span>

                                  <span v-if="scope.row.sharesYjbgs[0].sjltz !=null" :style="{'color': ( scope.row.sharesYjbgs[0].sjltz>0 ? '#de2f29':'#6ade4c')}">
                                r{{(scope.row.sharesYjbgs[0].sjltz).split(".")[0]}}
                                  </span>
                        </div>
<!--                        syl-->
                        <span v-if="scope.row.ggsyl!=null&&scope.row.hysyl!=null">
                             <span>  {{(scope.row.ggsyl.f9).split(".")[0]}}</span>
                                            <span> {{(scope.row.hysyl.f2009).split(".")[0]}}</span>
                            <span>  {{scope.row.ggsyl.f1009}}:{{scope.row.hysyl.f134}}</span>
                        </span>

                    </template>
                </el-table-column>
                <el-table-column
                        label="风险"
                >
                    <template slot-scope="scope">
                        <div>
                            <!--              <span :style="{'color': ( scope.row.zback<10 ? '#de2f29':'#090510')}"> {{ scope.row.zback }}% </span>-->
                            <span> {{ scope.row.zback }}% </span>

                            <span :style="{'color': ( ((scope.row.zzdfsub>0)&&(scope.row.zzdfsub<10 ))? '#de2f29':'#090510')}"> {{ scope.row.zzdfsub }} </span>
                        </div>
                        <div>
                            <!--              <span :style="{'color': ( scope.row.yback<10 ? '#de2f29':'#090510')}"> {{ scope.row.yback }}% </span>-->
                            <span> {{ scope.row.yback }}% </span>

                            <span :style="{'color': ( ((scope.row.yzdfsub>0)&&(scope.row.yzdfsub<10 ))? '#de2f29':'#090510')}"> {{ scope.row.yzdfsub }} </span>
                        </div>
                        <div>
                            <!-- 超过周最大涨幅-->
                            <span :style="{'color': ( ((scope.row.maxzzdf>-15)&&(scope.row.maxzzdf<10 ))? '#de3ecf':'#090510')}"> z:{{ scope.row.maxzzdf }} </span>

                            <!-- 涨幅超过周次数-->
                            <span v-if="scope.row.zvoList!=null">
                             <span :style="{'color': ( (scope.row.zvoList.length-scope.row.zzfsign)<3 ? '#de2f29':'#090510')}">
                                 {{scope.row.zzfsign}}/{{scope.row.zvoList.length}}
                             </span>
                          </span>
                        </div>
                        <div>
                            <!-- 超过月最大涨幅-->
                          <span :style="{'color': ( ((scope.row.maxyzdf>-15)&&(scope.row.maxyzdf<10 ))? '#de3ecf':'#090510')}"> y:{{ scope.row.maxyzdf }} </span>
                            <!-- 涨幅超过月次数-->
                         <span v-if="scope.row.yvoList!=null">
                          <span :style="{'color': ( (scope.row.yvoList.length-scope.row.yzfsign)<3 ? '#de3ecf':'#090510')}">
                            {{scope.row.yzfsign}}/{{scope.row.yvoList.length}}
                            </span>
                         </span>
                        </div>

                        <div v-if="scope.row.sharesGdnums!=null&&scope.row.sharesGdnums.length>0">
                            <span :style="{'color': ( (scope.row.sharesGdnums[0].holderNumRatio).substring(0,5)<=0 ? '#52de58':'#090510')}">
                                  {{(scope.row.sharesGdnums[0].holderNumRatio).substring(0,5)}}%
                            </span>
                            <span :style="{'color': ( (scope.row.sharesGdnums[0].endDate).indexOf('09-30')!=-1 ? '#100b0c':'#de3ecf')}">
                                   {{(scope.row.sharesGdnums[0].endDate).substring(5,10)}}
                            </span>

                        </div>
                        <div>
                              <span v-if="scope.row.jbzf!=null">
                                {{scope.row.jbzf}}%
                            </span>
                        </div>
                    </template>
                </el-table-column>


                <el-table-column
                        width="800"
                        v-if="kf"
                >
                    <template slot-scope="scope">
                        <div><img :src="scope.row.srcf" ></div>
                    </template>
                </el-table-column>
                <el-table-column
                        v-if="kr"
                        width="500">
                    <template slot-scope="scope" >
                        <div><img :src="scope.row.srcr" width="100%"></div>
                    </template>
                </el-table-column>
                <el-table-column
                        v-if="kz"
                        width="500">
                    <template slot-scope="scope">
                        <div><img :src="scope.row.srcz" width="100%"></div>
                    </template>
                </el-table-column>
                <el-table-column
                        v-if="k5"
                        width="500">
                    <template>
                        <div><img :src="scope.row.src5" width="100%"></div>
                    </template>
                </el-table-column>
                <el-table-column
                        v-if="ky"
                        width="500">
                    <template slot-scope="scope">
                        <div><img :src="scope.row.srcy" width="100%"></div>
                    </template>
                </el-table-column>
            </el-table>

        </el-container>
    </div>

</template>

<script>
    import Axios from 'axios';
    export default {
        name: "Shares",
        props: {
            id_code: String
        },
        data() {
            return {
                getRowKeys(row) {
                    return row.id;
                },
                sharesList:null,
                xianshi:null,
                img:null,
                srcr:null,
                checkedts: false,
                checkedtsnum: false,
                checkedcm: false,
                checkedzfs: false,
                checkedyfs: false,
                checkedzzdf: false,
                checkedzmax: false,
                checkedzf: false,
                checkedjj: false,
                checkedxtj: false,
                checkeddd: false,
                checkedbg: false,
                checkedycyfs: true,
                checkedyczfs: true,
                checkedydb: false,
                checkedyd: false,
                checkedjz: false,
                checkedyzyz: false,
                checkedzmavg: false,
                checkedjx: false,
                expands: [],
                kf:false,
                kr:false,
                k5:false,
                kz:false,
                ky:false,
                timer: null,
                nowWeek: '',
                nowDate: '',
                nowTime: '',
                sshyPrecentVo:null,
                ssGnPrecentVo:null,
                activeNames: ['1']
            }
        },

        created(){
            // console.log(this.$route.query.id_code);
            if(this.$route.query.id_code!=null){
                this.getOndData(this.$route.query.id_code);
                this.activeNames=[];
            }
            this.sshy('');
            this.ssgn('');
            // this.getListData();
            // console.log("=="+this.nowWeek)
        },
        filters: {
            numFilter(value) {
                // 截取当前数据到小数点后两位
                value= value*100;

                let tempVal = parseFloat(value).toFixed(3);
                let realVal = tempVal.substring(0, tempVal.length - 1);
                return realVal;
            },
            numberFormat: function (value="") {
                if(value==null){
                    return "-";
                }
                if(value.indexOf("-")==0){
                    value= value.substring(1);
                    let unit = '';
                    var k = 10000,
                        sizes = ['', '万', '亿', '万亿'],
                        i;
                    if(value < k){
                        value =value;
                    }else{
                        i = Math.floor(Math.log(value) / Math.log(k));
                        value = ((value / Math.pow(k, i))).toFixed(2);
                        unit = sizes[i];
                    }
                    return "-"+value+unit;
                }else{
                    let unit = '';
                    var k = 10000,
                        sizes = ['', '万', '亿', '万亿'],
                        i;
                    if(value < k){
                        value =value;
                    }else{
                        i = Math.floor(Math.log(value) / Math.log(k));
                        value = ((value / Math.pow(k, i))).toFixed(2);
                        unit = sizes[i];
                    }
                    return value+unit;
                }

            }
        },
        mounted () {
            this.timer = setInterval(() => {
                this.setNowTimes()
            }, 1000)
        },
        methods:{
            handleChange(val) {
            },
            sshy(value){//网络请求数据
                //所属行业占比
                var purl=this.Global.httpUrl+"/shares/getSshyPrecent"+'?order='+value;
                Axios.get(purl).then((res)=>{
                    this.sshyPrecentVo=res.data.data;
                    console.log(res.data);
                }).catch((error)=>{
                    console.log(error);
                })
            },
            ssgn(value){//网络请求数据
                //所属行业占比
                var purl=this.Global.httpUrl+"/shares/getSsGnPrecent"+'?order='+value;
                Axios.get(purl).then((res)=>{
                    this.ssGnPrecentVo=res.data.data;
                    console.log(res.data);
                }).catch((error)=>{
                    console.log(error);
                })
            },
            setNowTimes () {
                let myDate = new Date()
                let wk = myDate.getDay()
                let yy = String(myDate.getFullYear())
                let mm = myDate.getMonth() + 1
                let dd = String(myDate.getDate() < 10 ? '0' + myDate.getDate() : myDate.getDate())
                let hou = String(myDate.getHours() < 10 ? '0' + myDate.getHours() : myDate.getHours())
                let min = String(myDate.getMinutes() < 10 ? '0' + myDate.getMinutes() : myDate.getMinutes())
                let sec = String(myDate.getSeconds() < 10 ? '0' + myDate.getSeconds() : myDate.getSeconds())
                let weeks = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六']
                let week = weeks[wk]
                this.nowDate = yy + '-' + mm + '-' + dd
                this.nowTime = hou + ':' + min + ':' + sec
                this.nowWeek = week
            },
            changestatus(itme){
            },
            clickRowHandle(row, column, event) {
                if (this.expands.includes(row.id)) {
                    this.expands = this.expands.filter(val => val !== row.id);
                } else {
                    this.expands.push(row.id);
                }
            },
            handleOpen(key, keyPath) {
                console.log(key, keyPath);
            },
            handleClose(key, keyPath) {
                console.log(key, keyPath);
            },

            getOndData(value){
                var url=this.Global.httpUrl+"/shares/getHiCode?code="+value;
                Axios.get(url).then((response)=>{
                    this.sharesList=response.data.data;
                }).catch((error)=>{
                    console.log(error);
                })
            },

            getListData(itme,index){//网络请求数据
                var param="?";
                if(this.checkedts==true){
                    param=param+"ts=1&"
                }
                if(this.checkedtsnum==true){
                    param=param+"tsnum=1&"
                }
                if(this.checkedcm==true){
                    param=param+"cm=1&"
                }
                if(this.checkedzfs==true){
                    param=param+"zfs=1&"
                }
                if(this.checkedyfs==true){
                    param=param+"yfs=1&"
                }
                if(this.checkedzzdf==true){
                    param=param+"zzdf=1&"
                }
                if(this.checkedzmax==true){
                    param=param+"zmax=1&"
                }
                if(this.checkedzf==true){
                    param=param+"zf=1&"
                }
                if(this.checkedjj==true){
                    param=param+"jj=1&"
                }
                if(this.checkedxtj==true){
                    param=param+"xtj=1&"
                }
                if(this.checkedbg==true){
                    param=param+"bg=1&"
                }
                if(this.checkedyczfs==true){
                    param=param+"yczfs=1&ycyfs=1&"
                }
                if(this.checkedydb==true){
                    param=param+"db=1&"
                }
                if(this.checkedyd==true){
                    param=param+"yd=1&"
                }
                if(this.checkedjx==true){
                    param=param+"jx=1&"
                }
                if(this.checkedzmavg==true){
                    param=param+"mavg=1&"
                }
                if(this.checkedyzyz==true){
                    param=param+"zyz=1&"
                }
                if(this.checkedjz==true){
                    param=param+"jz=1&"
                }
                if(itme!=null&&index==1){
                    if(itme!=null&&itme!=''){
                        param=param+"gn="+itme
                    }
                }
                if(itme!=null&&index==2){
                    if(itme!=null&&itme!=''){
                        param=param+"hy="+itme
                    }
                }
                if(this.id_code!=null){
                    param=param+"code="+this.id_code
                }
                var url=this.Global.httpUrl+"/shares/getHiCode"+param;
                Axios.get(url).then((response)=>{
                    this.sharesList=response.data.data;
                }).catch((error)=>{
                    console.log(error);
                })
            },
        },
    }
</script>

<style scoped>

</style>